import { Component, ComponentFactoryResolver, OnInit, Type, ViewChild } from '@angular/core';
import { DailyDispatchDirective } from './daily-dispatch.directive';
import { DdOverviewComponent } from './dd-overview/dd-overview.component';
import { DdIrrAreaComponent } from './dd-irr-area/dd-irr-area.component';
import { DdInletComponent } from './dd-inlet/dd-inlet.component';
import { DdFeeComponent } from './dd-fee/dd-fee.component';
import { DdSectionComponent } from './dd-section/dd-section.component';

export class CompItem {
    constructor(public component: Type<any>) {}
}

@Component({
    selector: 'app-daily-dispatch',
    templateUrl: './daily-dispatch.component.html',
    styleUrls: ['./daily-dispatch.component.scss']
})
export class DailyDispatchComponent implements OnInit {
    compList = [];
    currentCompIndex = 0;
    @ViewChild(DailyDispatchDirective, { static: true }) appDdHost: DailyDispatchDirective;

    constructor(private componentFactoryResolver: ComponentFactoryResolver) {
        this.compList = this.getCompItems();
    }

    ngOnInit(): void {
        this.loadComponent(0);
    }

    getCompItems() {
        return [
            new CompItem(DdOverviewComponent),
            new CompItem(DdIrrAreaComponent),
            new CompItem(DdInletComponent),
            new CompItem(DdFeeComponent),
            new CompItem(DdSectionComponent)
        ];
    }

    loadComponent(index) {
        this.currentCompIndex = index;
        const compItem = this.compList[this.currentCompIndex];
        const componentFactory = this.componentFactoryResolver.resolveComponentFactory(compItem.component);
        const viewContainerRef = this.appDdHost.viewContainerRef;
        viewContainerRef.clear();
        const componentRef = viewContainerRef.createComponent(componentFactory);
    }
}

